<template>
  <div>
      <BaseA></BaseA>
      <BaseB>
       <template v-slot:插槽名字>内容</template>
       <template v-slot:插槽名字>内容2</template>
       <template #default="obj">
         obj.key

       </template>
       <template #default="obj">
        <button @click="=del(obj.id)"></button>
       </template>
      </BaseB>
      

  </div>
</template>
<script>
import {mapState} from 'Vuex'
import BaseA from './components/BaseA.vue'
import BaseB from './components/BaseB.vue'
import Son from './components/son.vue'
import {mapState} from 'vuex'
import {mapState} from 'vuex'
mapState(['count'])
mapState(['key'])
mapState(['key1','key2'])
export default{
  mapState(['key'])
  import axios from 'axios',
  props: {
    visible: Boolean
  }
  components: {
    Son,
    BaseA,
    BaseB
  },
  data(){
    return {
      myTitle: '学前端'
    }
  },
  methos: {
    close(){
      this.$emit('update:visible',this.bianlaing)
    }
    fn(i){
      caozuodata
    }
  },
  async created(){
    // await axios({
    //   url: '',
    //   params: {
    //     key: value
    //   }
    // })
    const res = await axios.get('url')
    this.key = res.data.data
  }
}
directives: {
  loading: {
    inserted(key,binding){
      bingding.value
      binding.value? el.calssList.addd('loading'):el.classList.remove
      
    }
  }
}
</script>
<style scoped>
.loading:before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100px;
  height: 100px;
  background: #fff url('./1.gpg') no-repeat center;
  backgroun: #fff url('./1.jgp') no-repoeat center;

}
</style>